<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户</title>
    <!-- 浏览器 拿到 link 标签以后 会再次向服务器 发起请求 -->
    <link rel="stylesheet" href="./index.css">
    <link rel="stylesheet" href="./font/iconfont.css">
</head>

<body>
    <div class="tan">
        <div class="kuang">
            <p>添加岗位</p>
            <div class="name">
                <b>岗位名称</b><input type="text" placeholder="请输入岗位名称">
            </div>
            <div class="code">
                <b>岗位编码</b><input type="text" placeholder="请输入编码名称">
            </div>
            <div class="btn">
                <button>确定</button>
                <button class="quxiao">取消</button>
            </div>
        </div>

    </div>

    <main>
        <aside>
            <div class="hezi title">管理系统</div>
            <div class="hezi"><span class="iconfont icon-home"></span>首页</div>
            <div class="hezi"><span class="iconfont icon-zhuantiguanli"></span>系统管理</div>
            <div class="hezi active"><span class="iconfont icon-yonhu"></span>用户管理</div>
            <div class="hezi hezi2"><span class="iconfont icon-shezhi"></span>角色管理</div>
            <div class="hezi hezi2"><span class="iconfont icon-xitongrizhi"></span>菜单管理</div>
            <div class="hezi hezi2"><span class="iconfont icon-xitongrizhi"></span>部门管理</div>
            <div class="hezi hezi2"><span class="iconfont icon-xitongrizhi"></span>岗位管理</div>
            <div class="hezi hezi2"><span class="iconfont icon-xitongrizhi"></span>字典管理</div>
            <div class="hezi hezi2"><span class="iconfont icon-xitongrizhi"></span>参数设置</div>
            <div class="hezi hezi2"><span class="iconfont icon-xitongrizhi"></span>通知公告</div>
            <div class="hezi hezi2"><span class="iconfont icon-xitongrizhi"></span>日志管理</div>
            <div class="hezi"><span class="iconfont icon-xitongrizhi"></span>系统监控</div>
        </aside>
        <div id="box">
            <header>
                <span class="iconfont icon-xitongrizhi"></span>
                <span class="user"><span class="iconfont icon-yonghu"> </span><span class="gangwei">name</span></span>
            </header>
            <nav>
                <button>首页</button>
                <button>岗位管理</button>
            </nav>
            <div class="searchbox">
                <b>岗位名称</b>
                <input type="text" placeholder="请输入岗位名称">
                <span class="search">搜索</span>
                <span class="reset">重置</span>
            </div>
            <div class="edit">
                <div class="addbox addbox1"><span class="add"><span class="iconfont icon-tianjia"></span>新增</span></div>
                <div class="addbox"><span class="add"><span class="iconfont icon-tianjia"></span>修改</span></div>
                <div class="addbox"><span class="add"><span class="iconfont icon-tianjia"></span>删除</span></div>
                <div class="addbox"><span class="add"><span class="iconfont icon-tianjia"></span>导出</span></div>

            </div>
            <div class="table">
                <ul class="table-head">
                    <li><input type="checkbox"></li>
                    <li>岗位编号</li>
                    <li>岗位编码</li>
                    <li>岗位名称</li>
                    <li>岗位排序</li>
                    <li>状态</li>
                    <li>创建时间</li>
                    <li>操作</li>
                </ul>

                <div class="table-body">
                    <ul class="row">
                        <li><input type="checkbox"></li>
                        <li>1</li>
                        <li>张伟</li>
                        <li>13611129070</li>
                        <li>编辑组</li>
                        <li>正常</li>
                        <li>2022-10-19 20:56:47</li>
                        <li>
                            <span class="iconfont icon-bianji editicon" id="101">修改</span>
                            <span class="iconfont icon-shanchu deleteicon" id="101">删除</span>
                        </li>
                    </ul>
                    <ul class="row">
                        <li><input type="checkbox"></li>

                        <li>2</li>
                        <li>张伟</li>
                        <li>13611129070</li>
                        <li>编辑组</li>
                        <li>正常</li>
                        <li>2022-10-19 20:57:36</li>
                        <li>
                            <span class="iconfont icon-bianji editicon" id="101">修改</span>
                            <span class="iconfont icon-shanchu deleteicon" id="101">删除</span>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="ope">
                <span class="prev"><</span>
                <span class="next">></span>
            </div>
        </div>
    </main>
    <div class="mask">
        <div class="content">
            <div class="line">
                <label>邮箱</label> <input type="text" placeholder="输入邮箱">
            </div>
            <div class="line">
                <label>姓名</label> <input type="text" placeholder="输入姓名">
            </div>
            <div class="line">
                <label>电话</label> <input type="text" placeholder="输入电话">
            </div>
            <div class="line">
                <input class="add" type="button" value="添加用户">
            </div>
        </div>
    </div>

    <!-- axios.min.js 文件专门用来发送ajax请求的文件, 内部会暴露出一个axios对象 -->
    <script src="./axios.min.js"></script>
    <!-- 自己的js文件 如果想要用axios来发请求, 必须在 axios.min.js 文件之后引入 -->
    <script src="./index.js"></script>

</body>

</html>